<template>
  <div class="banner">
      <swiper :options="swiperOption">
          <swiper-slide v-for="item of banner" :key="item.id">
              <img :src="item.imgUrl" alt="">
          </swiper-slide>
      </swiper>
  </div>
</template>
<script>
export default {
  name: "HomeBanner",
  props: {
      banner:{
          type:Array
      }
  },
  data() {
    return {
        swiperOption:{
            pagination:{
                el:".swiper-pagination"
            },
            loop:true,
            autoplay:{
                disableOnInteraction:false
            }
        }
    };
  }
};
</script>
<style lang="scss" scoped>
img{
    width: 100%;
    height: 200px;
}
</style>
